﻿import { Component } from '@angular/core';
@Component({
    selector: 'navbar',
    template: `
<header class="app-header navbar">
  <button class="navbar-toggler mobile-sidebar-toggler hidden-lg-up" type="button">&#9776;</button>
  <a class="navbar-brand" href="#"></a>
  
  <ul class="nav navbar-nav hidden-md-down">
    <li class="nav-item">
      <a class="nav-link navbar-toggler sidebar-toggler" href="#">&#9776;</a>
    </li>
    <li class="nav-item px-1">
      <a class="nav-link bigger" href="#">门户</a>
    </li>
    <li class="nav-item px-1">
      <a class="nav-link bigger" href="#">传阅</a>
    </li>
    <li class="nav-item px-1">
      <a class="nav-link bigger" href="#">流程</a>
    </li>
    <li class="nav-item px-1">
      <a class="nav-link bigger" href="#">文档</a>
    </li>
  </ul>
  <ul class="nav navbar-nav ml-auto">
    <li class="nav-item hidden-md-down">
      <a class="nav-link" href="#"><i class="fa fa-star-o"></i></a>
    </li>
    <li class="nav-item hidden-md-down">
      <a class="nav-link" href="#">
        <i class="fa fa-address-book-o"></i>
      </a>
    </li>
    <li class="nav-item hidden-md-down">
      <a class="nav-link aside-menu-toggler" href="#">
        <i class="fa fa-bell-o"></i>
        <span class="badge badge-pill badge-danger">5</span>
      </a>
    </li>
    <li class="nav-item last dropdown" ngbDropdown placement="bottom right">
      <a class="nav-link dropdown-toggle" id="simple-dropdown" href="#" role="button" aria-haspopup="true" aria-expanded="false" ngbDropdownToggle>
        <img src="//127.0.0.1:4200/assets/img/avatars/6.jpg" class="img-avatar" alt="admin@bootstrapmaster.com">
        <span class="hidden-md-down">admin</span>
      </a>
      <div class="dropdown-menu dropdown-menu-right" aria-labelledby="simple-dropdown">

        <div class="dropdown-header text-center"><strong>Account</strong></div>

        <a class="dropdown-item" href="#"><i class="fa fa-bell-o"></i> Updates<span class="badge badge-info">42</span></a>
        <a class="dropdown-item" href="#"><i class="fa fa-envelope-o"></i> Messages<span class="badge badge-success">42</span></a>
        <a class="dropdown-item" href="#"><i class="fa fa-tasks"></i> Tasks<span class="badge badge-danger">42</span></a>
        <a class="dropdown-item" href="#"><i class="fa fa-comments"></i> Comment<span class="badge badge-warning">42</span></a>

        <div class="dropdown-header text-center"><strong>Settings</strong></div>

        <a class="dropdown-item" href="#"><i class="fa fa-user"></i> Profile</a>
        <a class="dropdown-item" href="#"><i class="fa fa-wrench"></i> Setting</a>
        <a class="dropdown-item" href="#"><i class="fa fa-usd"></i> Payments<span class="badge badge-default">42</span></a>
        <a class="dropdown-item" href="#"><i class="fa fa-file"></i> Projects<span class="badge badge-primary">42</span></a>
        <div class="divider"></div>
        <a class="dropdown-item" href="#"><i class="fa fa-shield"></i> Lock account</a>
        <a class="dropdown-item" href="#"><i class="fa fa-lock"></i> Logout</a>
      </div>
    </li>
  </ul>
  
</header>`
})
export class NavbarComponent {
    constructor() { }
    ngOnInit(): void {

    }
}

